<template>
	<view style="padding-bottom:50rpx;">
		<page-head :title="'优惠券'" :headtype="2"></page-head>
		<view class="available marginAuto">可用({{ allnum }})</view>
		<view class="disount">
			<discount :disdata = "disdata" @disusefun="disusefun"></discount>
		</view>
		<view class="marginAuto" style="width:600rpx;margin-top:60rpx;">
			<uv-button text="确定" @click="enter()" :customStyle="{
				'background':'#1686F8',
				'color':'#ffffff',
				'font-size':'30rpx',
				'width':'600rpx',
				'height':'100rpx',
				'border-radius':'100rpx'
			}"></uv-button>
		</view>
	</view>
</template>

<script>
	import discount from '../../components/discount/discount.vue'
	export default {
		components: {
			discount
		},
		data() {
			return {
				apifun:this.apifun,
				page:1,
				ordersn:'',
				disid:'',
				disitem:{},
				disdata:[],
				allnum:0
			};
		},
		onLoad(option) {
			this.ordersn = option.ordersn;  //  订单号
			this.apisite = option.apisite; // 获取对应优惠券接口
			this.initData()
		},
		methods: {
			enter(){
				this.disdata.forEach((item,index)=>{
					if(item.ac){
						this.disid = item.id
						this.disitem = item;
					}
				});
				uni.$emit('emitdiscount',{'disitem':this.disitem});
				setTimeout(()=>{
					this.apifun.goback();
				})
			},
			disusefun(item){
				this.disdata.forEach((item,index)=>{
					this.$set(item,'ac',false)
				})
				item.ac = true;
			},
			initData(){
				let sendData = {
					order_sn:this.ordersn,
					page:this.page,
					limit:this.apifun.limit
				}
				this.apifun.unirequest(this.apisite,'post',sendData,(res)=>{
					if(res.code === 200){
						let datas = res.data;
						this.allnum = datas.total;
						if(datas.list.length <= 0){
							this.page--;
							return false
						};
						this.disdata = [...this.disdata,...datas.list]
					}else{
						this.apifun.toast(res.msg)
					}
				})
			}
		},
		onPullDownRefresh() {
			this.page = 1;
			this.disdata = [];
			this.initData();
			uni.stopPullDownRefresh();
		},
		onReachBottom() {
			this.page++;
			this.initData()
		},
	};
</script>

<style scoped lang="scss">
	page{
		background: #F7F7F7;
	}
	.available{
		width: 690rpx;
		padding: 30rpx 0 0;
		line-height: 50rpx;
		color:#222222;
		font-size: 36rpx;
	}
</style>